<template>
  <div class="conBox">
    <div class="pictureheader bg_style border_style ">
      <Select style="width:322px" class="select-border"  stu v-if="showDatePick" placeholder="请选择统计周期" @on-change="dayClick">
        <Option v-for="(item, index) in day.dayList" :value="item.state" :key="index" :label="item.name">{{ item.name
        }}</Option>
      </Select>
      <YsDatePicker type="daterange" class=" pickerborder"  :class="curTheme" v-else placeholder="请选择统计周期" @on-change="handleChange" transfer
        placement="bottom-start"></YsDatePicker>
      <YsTooltip placement="top" :content="showDatePick?`自定义查询`:`周期查询`">
        <div class="analysis-add bg_style border_style" @click="datePickClick">
          <YsIcon type="md-swap" class="text_01" />
        </div>
      </YsTooltip>
      <Select style="width:200px;margin-right:10px" placeholder="请选择检测单位" class="select-border" :disabled="setDisabled"
        @on-change="getSubscribeAppList" v-model="page.subscribeState">
        <Option v-for="(item, index) in page.subscribelist" :value="parseInt(item.dept_ent_no)" :key="index"
          :label="item.dept_cn_name">{{ item.dept_cn_name }}</Option>
      </Select>
      <Select style="width:200px;margin-right:10px" placeholder="请选择检测任务号" class="select-border" @on-change="batchClick"
        v-model="batch.batchValue">
        <Option v-for="(item, index) in batch.batchList" :value="parseInt(item.detect_code)" :key="index"
          :label="item.detect_name">{{ item.detect_name }}</Option>
      </Select>
      <YsButton type="primary" class="searchBtn" @click="searchDefect">查询</YsButton>
      <div class="open-btn">
        <YsButton class="searchBtn" style="padding:0" @click="export2Excel">导出数据</YsButton>
      </div>
    </div>
    <div class="anouter" v-if="tableData.length>0">
      <div class="analysis-left">
        <ul class="analysis-l-bom bg_style  border_style">
          <li class="border_style" style="padding-bottom:6px">
            <div class="analysis-title">
              <label class="car_title">检测任务信息</label>
              <span class="text_style"> {{ objValue.job_code ? objValue.job_code : '- -' }}</span>
            </div>
            <div class="list-top" style="margin-top:10px">
              <label :class="`${curTheme}-01`">检测样本量</label>
              <span class="text_style"> {{ objValue.job_sample_total ? objValue.job_sample_total : '- -' }}</span>
            </div>
            <div class="list-top">
              <label :class="`${curTheme}-01`">检测人</label>
              <span class="text_style">{{ objValue.ent_name ? objValue.ent_name : '- -' }}</span>
            </div>
            <div class="list-top">
              <label :class="`${curTheme}-01`">检测开始时间</label>
              <span class="text_style">{{ objValue.start_time ? objValue.start_time : '- -' }}</span>
            </div>
            <div class="list-top">
              <label :class="`${curTheme}-01`">检测结束时间</label>
              <span class="text_style">{{ objValue.end_time ? objValue.end_time : '- -' }}</span>
            </div>
          </li>
          <li class="box-li01 border_style">
            <label class="car_title">综合评定等级分布</label>
            <div class="box-draw" id="pie"></div>
          </li>
          <li class="box-li02 ">
            <label class="car_title">缺陷类型结果分布</label>
            <div class="box-draw" id="bar"></div>
          </li>
        </ul>
      </div>
      <div class="analysis-right">
        <div class="analysis-r-bom bg_style  border_style" ref="tableOuter">
          <YsTable class="table-3" :class="curTheme+'-table'" :columns="tableColumn" no-data-text=""
            :height="now_height" :border="true" width="100%" :data="tableData">
            <template slot="yx-1" slot-scope="{ row }">
              {{ row.round_rate ? row.round_rate.oneLevelBean ? row.round_rate.oneLevelBean.level_num : '--' : '--' }}
            </template>
            <template slot="yx-2" slot-scope="{ row }">
              {{ row.round_rate ? row.round_rate.twoLevelBean ? row.round_rate.twoLevelBean.level_num : '--' : '--' }}
            </template>
            <template slot="yx-3" slot-scope="{ row }">
              {{ row.round_rate ? row.round_rate.threeLevelBean ? row.round_rate.threeLevelBean.level_num : '--' : '--'
              }}
            </template>
            <template slot="yx-4" slot-scope="{ row }">
              {{ row.round_rate ? row.round_rate.fourLevelBean ? row.round_rate.fourLevelBean.level_num : '--' : '--' }}
            </template>

            <template slot="tx-1" slot-scope="{ row }">
              {{ row.strip_rate ? row.strip_rate.oneLevelBean ? row.strip_rate.oneLevelBean.level_num : '--' : '--' }}
            </template>
            <template slot="tx-2" slot-scope="{ row }">
              {{ row.strip_rate ? row.strip_rate.twoLevelBean ? row.strip_rate.twoLevelBean.level_num : '--' : '--' }}
            </template>
            <template slot="tx-3" slot-scope="{ row }">
              {{ row.strip_rate ? row.strip_rate.threeLevelBean ? row.strip_rate.threeLevelBean.level_num : '--' : '--'
              }}
            </template>
            <template slot="tx-4" slot-scope="{ row }">
              {{ row.strip_rate ? row.strip_rate.fourLevelBean ? row.strip_rate.fourLevelBean.level_num : '--' : '--' }}
            </template>
            <template slot="wht-5" slot-scope="{ row }">
              --
            </template>
            <template slot="wht-1" slot-scope="{ row }">
              {{ row.no_penetration_rate ? row.no_penetration_rate.oneLevelBean ?
              row.no_penetration_rate.oneLevelBean.level_num : '--' : '--'
              }}
            </template>
            <template slot="wht-2" slot-scope="{ row }">
              {{ row.no_penetration_rate ? row.no_penetration_rate.twoLevelBean ?
              row.no_penetration_rate.twoLevelBean.level_num : '--' : '--'
              }}
            </template>
            <template slot="wht-3" slot-scope="{ row }">
              {{ row.no_penetration_rate ? row.no_penetration_rate.threeLevelBean ?
              row.no_penetration_rate.threeLevelBean.level_num : '--' : '--'
              }}
            </template>
            <template slot="wht-4" slot-scope="{ row }">
              {{ row.no_penetration_rate ? row.no_penetration_rate.fourLevelBean ?
              row.no_penetration_rate.fourLevelBean.level_num : '--' : '--'
              }}
            </template>

            <!--未熔合 -->
            <template slot="wrh-1" slot-scope="{ row }">
              {{ row.wrhRate ? row.wrhRate.oneLevelBean ? row.wrhRate.oneLevelBean.level_num : '--' : '--' }}
            </template>
            <template slot="wrh-2" slot-scope="{ row }">
              {{ row.wrhRate ? row.wrhRate.twoLevelBean ? row.wrhRate.twoLevelBean.level_num : '--' : '--' }}
            </template>
            <template slot="wrh-3" slot-scope="{ row }">
              {{ row.wrhRate ? row.wrhRate.threeLevelBean ? row.wrhRate.threeLevelBean.level_num : '--' : '--' }}
            </template>
            <template slot="wrh-4" slot-scope="{ row }">
              {{ row.wrhRate ? row.wrhRate.fourLevelBean ? row.wrhRate.fourLevelBean.level_num : '--' : '--' }}
            </template>
            <!-- 裂纹 -->
            <template slot="hy-1" slot-scope="{ row }">
              {{ row.lwRate ? row.lwRate.oneLevelBean ? row.lwRate.oneLevelBean.level_num : '--' : '--' }}
            </template>
            <template slot="hy-2" slot-scope="{ row }">
              {{ row.lwRate ? row.lwRate.twoLevelBean ? row.lwRate.twoLevelBean.level_num : '--' : '--' }}
            </template>
            <template slot="hy-3" slot-scope="{ row }">
              {{ row.lwRate ? row.lwRate.threeLevelBean ? row.lwRate.threeLevelBean.level_num : '--' : '--' }}
            </template>
            <template slot="hy-4" slot-scope="{ row }">
              {{ row.lwRate ? row.lwRate.fourLevelBean ? row.lwRate.fourLevelBean.level_num : '--' : '--' }}
            </template>
          </YsTable>
        </div>
      </div>

    </div>
    <div :class="curTheme" class="anouter2 border_style" v-if="tableData.length==0">
      <div class="default-box">
        <img class="default-img" src="../../assets/images/default2.png" alt="">
        <p> 暂无数据</p>
      </div>
    </div>
  </div>
</template>
<script>
import { mapGetters, mapState, mapActions } from "vuex";
export default {
  name: "application",
  data() {
    return {
      showDatePick: true,
      now_height: null,
      all_yangben: 0,
      all_renwu: 0,
      tableData: [],
      tableColumn: [
        {
          title: '检测任务号',
          key: 'job_code',
          align: 'center',
          width: 150
        },
        {
          title: '综合评定',
          key: 'rate_level',
          align: 'center',
          width: 100,
          render: (h, params) => {
            if (params.row.rate_level == '1') {
              return h('div', {
                class: "boxColor",
                style: { backgroundColor: 'rgba(0, 145, 255, 1)' },
              }, 'Ⅰ级')
            }
            if (params.row.rate_level == '2') {
              return h('div', { class: "boxColor", style: { backgroundColor: 'rgba(19, 179, 143, 1)' }, }, 'Ⅱ级')
            }
            if (params.row.rate_level == '3') {
              return h('div', { class: "boxColor", style: { backgroundColor: 'rgba(231, 121, 48, 1)' }, }, 'Ⅲ级')
            }
            if (params.row.rate_level == '4') {
              return h('div', { class: "boxColor", style: { backgroundColor: 'rgba(213, 57, 57, 1)' }, }, 'Ⅳ级')
            }
          }
        },

        {
          title: '圆形缺陷',
          align: 'center',
          children: [
            { title: 'I级', key: 'round_rate', align: 'center', width: 80, slot: 'yx-1' },
            { title: 'II级', key: 'cname', align: 'center', width: 80, slot: 'yx-2' },
            { title: 'III级', key: 'cname', align: 'center', width: 80, slot: 'yx-3' },
            { title: 'IV级', key: 'level_num', align: 'center', width: 80, slot: 'yx-4' },
          ]
        },
        {
          title: '条形缺陷',
          align: 'center',
          children: [
            { title: 'I级', key: 'caddress', align: 'center', width: 90, slot: 'tx-1' },
            { title: 'II级', key: 'cname', align: 'center', width: 90, slot: 'tx-2' },
            { title: 'III级', key: 'cname', align: 'center', width: 90, slot: 'tx-3' },
            { title: 'IV级', key: 'cname', align: 'center', width: 90, slot: 'tx-4' },
          ]
        },
        {
          title: '未焊透',
          align: 'center',
          key: 'wht',
          children: [
            { title: 'I级', key: 'caddress', align: 'center', width: 90, slot: 'wht-1' },
            { title: 'II级', key: 'cname', align: 'center', width: 90, slot: 'wht-2' },
            { title: 'III级', key: 'cname', align: 'center', width: 90, slot: 'wht-3' },
            { title: 'IV级', key: 'cname', align: 'center', width: 90, slot: 'wht-4' },
          ]
        },
        {
          title: '未熔合',
          key: 'wrh',
          align: 'center',
          width: 100,
          children: [
            { title: 'I级', key: 'caddress', align: 'center', width: 90, slot: 'wrh-1' },
            { title: 'II级', key: 'cname', align: 'center', width: 90, slot: 'wrh-2' },
            { title: 'III级', key: 'cname', align: 'center', width: 90, slot: 'wrh-3' },
            { title: 'IV级', key: 'cname', align: 'center', width: 90, slot: 'wrh-4' },
          ]
        },
        {
          title: '裂纹',
          key: 'lw',
          align: 'center',
          width: 100,
          children: [
            { title: 'I级', key: 'caddress', align: 'center', width: 90, slot: 'hy-1' },
            { title: 'II级', key: 'cname', align: 'center', width: 90, slot: 'hy-2' },
            { title: 'III级', key: 'cname', align: 'center', width: 90, slot: 'hy-3' },
            { title: 'IV级', key: 'cname', align: 'center', width: 90, slot: 'hy-4' },
          ]
        }
      ],
      day: {
        dayValue: '',
        dateTime: [],
        dayList: [
          { state: 1, name: '当天' },
          { state: 2, name: '当周' },
          { state: 3, name: '当月' },
          { state: 4, name: '自定义查询' },
        ]
      },
      page: {
        subscribeState: '',
        subscribelist: [],
      },
      batch: {
        batchValue: '',
        batchList: []
      },
      objValue: {
        job_code: null,
        job_sample_total: null,
        ent_name: null,
        start_time: null,
        end_time: null
      },
    };
  },
  computed: {
    ...mapState(['curTheme']),
    setDisabled() {
      if (this.day.dayValue != "") {
        return false
      }
      if (this.day.dateTime.length > 0) {
        return false
      }
      return true
    }
  },
  watch: {
    tableData(v) {
      this.$nextTick(() => {
        if (this.$refs.tableOuter) {
          const clientHeight = this.$refs.tableOuter.offsetHeight;
          this.now_height = clientHeight
        }
      })
    },
    curTheme(v) {
      this.searchDefect()
    },
    'day.dateTime'(v) {
      if (v.length > 1) {
        if (v[0] == '' && v[1] == '') {
          this.page.subscribeState = ''
          this.day.dateTime = []
        }
      }
    },
  },
  methods: {
    ...mapActions([
      "sa_SpringEnterDeptPageView_queryDetectEnt", //查询入住企业
      "sa_SpringDetectFileFlawPageView_flawBatchQuery", //批次分析查询
      "sa_SpringDetectJobPageView_jobBoxQuery", //缺陷批次查询
    ]),
    dayClick(value) {
      if (value != 4) {
        this.day.dayValue = value
      } else {
        this.showDatePick = false
        this.day.dayValue = ""
      }
    },
    //查询周期选择
    getJobBoxQuery() {
      this.batch.batchList = []
      this.batch.batchValue = ''
      this.sa_SpringDetectJobPageView_jobBoxQuery({
        detect_ent_no: this.page.subscribeState.toString(),
        cycle: this.day.dayValue,
        start_date: this.day.dateTime.length > 0 ? this.day.dateTime[0] : "",
        end_date: this.day.dateTime.length > 0 ? this.day.dateTime[1] : "",
      }).then(res => {
        if (res.data) {
          this.batch.batchList = res.data.detectJobBeans
        } else {
          this.$YsMessage.error(res.msg)
        }
      })
    },
    //入住单位选择
    getSubscribeAppList(value) {
      this.subscribeState = value
      this.getJobBoxQuery()
    },
    //检测批次选择
    batchClick(value) {
      this.batch.batchValue = value
    },
    //查询缺陷综合分析
    searchDefect() {
      if (!this.batch.batchValue) {
        this.$YsMessage.error('请选择检测任务号')
        return
      }
      this.tableData = []
      this.sa_SpringDetectFileFlawPageView_flawBatchQuery({
        detect_ent_no: this.page.subscribeState.toString(),
        detect_code: this.batch.batchValue,
        cycle: this.day.dayValue,
        start_date: this.day.dateTime.length > 0 ? this.day.dateTime[0] : "",
        end_date: this.day.dateTime.length > 0 ? this.day.dateTime[1] : "",
      }).then(res => {
        if (res.data.jobBatchLevelBean) {
          this.objValue = res.data.jobBatchLevelBean
          this.tableData = this.objValue.jobLevelBeans  //表格数据
          this.pieData = this.objValue.synthesize_rate  //饼图数据
          this.drawPieEchart('pie', this.pieData)
          this.barData = this.objValue.class_flaw_rate //柱状图数据
          this.drawBarEchart('bar', this.barData)
        }
      })
    },
    drawPieEchart(id, data) {
      this.$nextTick(() => {
        let dataArr = []
        dataArr.push(
          { value: data.oneLevelBean ? data.oneLevelBean.proportion : 0, name: 'I级' },
          { value: data.twoLevelBean ? data.twoLevelBean.proportion : 0, name: 'II级' },
          { value: data.threeLevelBean ? data.threeLevelBean.proportion : 0, name: 'III级' },
          { value: data.fourLevelBean ? data.fourLevelBean.proportion : 0, name: 'IV级' },
        )
        let echarts_pre = this.$echarts.init(document.getElementById(id))
        let option = {
          tooltip: {
            trigger: 'item'
          },

          legend: {
            orient: 'horizontal',
            left: 'center',
            bottom: '10px',
            icon: "circle",
            textStyle: {
              color: this.curTheme == "theme-blue" ? "#cfd7e5" : 'rgba(64, 86, 128, 1)',
            }
          },
          color: ['rgba(24, 145, 252, 1)', 'rgba(19, 179, 143, 1)', 'rgba(231, 121, 48, 1)', 'rgba(213, 57, 57, 1)'],
          series: [
            {
              name: '',
              type: 'pie',
              radius: ['46%', '64%'],
              center: ['50%', '47%'],
              data: dataArr,
            }
          ]
        };
        echarts_pre.setOption(option)
        window.addEventListener("resize", () => {
          echarts_pre.resize();
        });
      })
    },
    drawBarEchart(id, dataValue) {
      this.$nextTick(() => {
        let obj1 = {}, obj2 = {}, obj3 = {}, obj4 = {}, obj5 = {}
        let xData = [], legendData = ['I级', 'II级', 'III级', 'IV级']
        for (let i in dataValue) {
          xData.push(dataValue[i].flaw_type_name)
        }
        for (let j in dataValue) {
          if (dataValue[j].flaw_type_name == '圆形') obj1 = dataValue[j]
          if (dataValue[j].flaw_type_name == '条形') obj2 = dataValue[j]
          if (dataValue[j].flaw_type_name == '未焊透') obj3 = dataValue[j]
          if (dataValue[j].flaw_type_name == '裂纹') obj4 = dataValue[j]
          if (dataValue[j].flaw_type_name == '未熔合') obj5 = dataValue[j]
        }

        let draw = this.$echarts.init(document.getElementById(id))
        let option = {
          color: ['rgba(245, 203, 41, 1)', 'rgba(24, 145, 252, 1)', 'rgba(19, 179, 143, 1)', 'rgba(231, 121, 48, 1)', 'rgba(213, 57, 57, 1)'],
          title: {
            top: 28,
            left: 8,
            text: '张',
            textStyle: {
              fontSize: 14,
              color: this.curTheme == "theme-blue" ? "#cfd7e5" : 'rgba(64, 86, 128, 1)',
            },
          },
          tooltip: {
            trigger: 'axis'
          },
          legend: {
            data: legendData,
            orient: 'horizontal',
            left: 'center',
            icon: "circle",
            top: '20px',
            textStyle: {
              color: this.curTheme == "theme-blue" ? "#cfd7e5" : 'rgba(64, 86, 128, 1)',
            }
          },
          xAxis: {
            data: ['圆形', '条形', '未焊透', '裂纹', '未熔合'],
            axisLine: { show: false, },
            axisTick: { show: false, },
            splitLine: { show: false },

            axisLabel: {
              show: true,
              interval: 0,
              textStyle: {
                fontSize: 14,
                color: this.curTheme == "theme-blue" ? "#cfd7e5" : "rgba(64, 86, 128, 1)",
              },
            },
            splitArea: { show: false }
          },
          yAxis: {
            axisTick: { show: false, },
            splitLine: {
              show: true, lineStyle: {
                color: "rgba(225, 230, 240, 1)",
              },
            },
            axisLabel: {
              show: true,
              textStyle: {
                fontSize: 14,
                color: this.curTheme == "theme-blue" ? "#cfd7e5" : "rgba(64, 86, 128, 1)",
              },
            },
            axisLine: {
              show: true,
              lineStyle: {
                color: "rgba(225, 230, 240, 1)",
              },
            },
            splitArea: { show: false }
          },
          grid: {
            bottom: 20
          },
          series:
            [
              {
                name: 'I级',
                type: 'bar',
                stack: 'one',
                data: [
                  obj1.oneLevelBean ? obj1.oneLevelBean.level_num : 0,
                  obj2.oneLevelBean ? obj2.oneLevelBean.level_num : 0,
                  obj3.oneLevelBean ? obj3.oneLevelBean.level_num : 0,
                  obj4.oneLevelBean ? obj4.oneLevelBean.level_num : 0,
                  obj5.oneLevelBean ? obj5.oneLevelBean.level_num : 0
                ]
              },
              {
                name: 'II级',
                type: 'bar',
                stack: 'one',
                data: [
                  obj1.twoLevelBean ? obj1.twoLevelBean.level_num : 0,
                  obj2.twoLevelBean ? obj2.twoLevelBean.level_num : 0,
                  obj3.twoLevelBean ? obj3.twoLevelBean.level_num : 0,
                  obj4.twoLevelBean ? obj4.twoLevelBean.level_num : 0,
                  obj5.twoLevelBean ? obj5.twoLevelBean.level_num : 0
                ]
              },
              {
                name: 'III级',
                type: 'bar',
                stack: 'one',
                data: [
                  obj1.threeLevelBean ? obj1.threeLevelBean.level_num : 0,
                  obj2.threeLevelBean ? obj2.threeLevelBean.level_num : 0,
                  obj3.threeLevelBean ? obj3.threeLevelBean.level_num : 0,
                  obj4.threeLevelBean ? obj4.threeLevelBean.level_num : 0,
                  obj5.threeLevelBean ? obj5.threeLevelBean.level_num : 0
                ]
              },
              {
                name: 'IV级',
                type: 'bar',
                stack: 'one',
                data: [
                  obj1.fourLevelBean ? obj1.fourLevelBean.level_num : 0,
                  obj2.fourLevelBean ? obj2.fourLevelBean.level_num : 0,
                  obj3.fourLevelBean ? obj3.fourLevelBean.level_num : 0,
                  obj4.fourLevelBean ? obj4.fourLevelBean.level_num : 0,
                  obj5.fourLevelBean ? obj5.fourLevelBean.level_num : 0
                ]
              },
            ]
        };
        draw.setOption(option)
        window.addEventListener("resize", () => {
          draw.resize();
        });
      })


    },
    //合并表格下载
    export2Excel(item) {
      import('../../utils/excel/Excel2Export').then((excel) => {
        const multiHeader = [
          ["检测任务号", '综合评定',
            '圆形缺陷', '', '', '',
            '条形缺陷', '', '', '',
            '未焊透', '', '', '',
            '未熔合', '', '', '',
            '裂纹']
        ];
        const multiHeader2 = [
          ["", "",
            'I级', 'II级', 'III级', 'IV级',
            'I级', 'II级', 'III级', 'IV级',
            'I级', 'II级', 'III级', 'IV级',
            'I级', 'II级', 'III级', 'IV级',
            'I级', 'II级', 'III级', 'IV级',
          ]

        ]
        const tHeader = [];
        const filterVal = [
          'job_code', 'rate_level',
          'round_rate_I', 'round_rate_II', 'round_rate_III', 'round_rate_IV',
          'strip_rate_I', 'strip_rate_II', 'strip_rate_III', 'strip_rate_IV',
          'no_penetration_rate_I', 'no_penetration_rate_II', 'no_penetration_rate_III', 'no_penetration_rate_IV',
          'wrhRate_I', 'wrhRate_II', 'wrhRate_III', 'wrhRate_IV',
          'lwRate_I', 'lwRate_II', 'lwRate_III', 'lwRate_IV'
        ]


        let datas = []
        for (let [index, item] of new Map(this.tableData.map((item, index) => [index, item]))) {
          datas[index] = {
            job_code: item.job_code ? item.job_code : '--',
            rate_level: item.rate_level ? item.rate_level : '--',

            round_rate_I: item.round_rate ? item.round_rate.oneLevelBean ? item.round_rate.oneLevelBean.level_num : '--' : '--',
            round_rate_II: item.round_rate ? item.round_rate.twoLevelBean ? item.round_rate.twoLevelBean.level_num : '--' : '--',
            round_rate_III: item.round_rate ? item.round_rate.threeLevelBean ? item.round_rate.threeLevelBean.level_num : '--' : '--',
            round_rate_IV: item.round_rate ? item.round_rate.fourLevelBean ? item.round_rate.fourLevelBean.level_num : '--' : '--',

            strip_rate_I: item.strip_rate ? item.strip_rate.oneLevelBean ? item.strip_rate.oneLevelBean.level_num : '--' : '--',
            strip_rate_II: item.strip_rate ? item.strip_rate.twoLevelBean ? item.strip_rate.twoLevelBean.level_num : '--' : '--',
            strip_rate_III: item.strip_rate ? item.strip_rate.threeLevelBean ? item.strip_rate.threeLevelBean.level_num : '--' : '--',
            strip_rate_IV: item.strip_rate ? item.strip_rate.fourLevelBean ? item.strip_rate.fourLevelBean.level_num : '--' : '--',


            no_penetration_rate_I: item.no_penetration_rate ? item.no_penetration_rate.oneLevelBean ? item.no_penetration_rate.oneLevelBean.level_num : '--' : '--',
            no_penetration_rate_II: item.no_penetration_rate ? item.no_penetration_rate.twoLevelBean ? item.no_penetration_rate.twoLevelBean.level_num : '--' : '--',
            no_penetration_rate_III: item.no_penetration_rate ? item.no_penetration_rate.threeLevelBean ? item.no_penetration_rate.threeLevelBean.level_num : '--' : '--',
            no_penetration_rate_IV: item.no_penetration_rate ? item.no_penetration_rate.fourLevelBean ? item.no_penetration_rate.fourLevelBean.level_num : '--' : '--',

            wrhRate: item.wrhRate ? item.wrhRate.noLevelBean ? item.wrhRate.noLevelBean.level_num : '--' : '--',
            lwRate: item.lwRate ? item.lwRate.noLevelBean ? item.lwRate.noLevelBean.level_num : '--' : '--',
            //未焊透
            wrhRate_I: item.wrhRate ? item.wrhRate.oneLevelBean ? item.wrhRate.oneLevelBean.level_num : '--' : '--',
            wrhRate_II: item.wrhRate ? item.wrhRate.twoLevelBean ? item.wrhRate.twoLevelBean.level_num : '--' : '--',
            wrhRate_III: item.wrhRate ? item.wrhRate.threeLevelBean ? item.wrhRate.threeLevelBean.level_num : '--' : '--',
            wrhRate_IV: item.wrhRate ? item.wrhRate.fourLevelBean ? item.wrhRate.fourLevelBean.level_num : '--' : '--',
            // 裂纹
            lwRate_I: item.lwRate ? item.lwRate.oneLevelBean ? item.lwRate.oneLevelBean.level_num : '--' : '--',
            lwRate_II: item.lwRate ? item.lwRate.twoLevelBean ? item.lwRate.twoLevelBean.level_num : '--' : '--',
            lwRate_III: item.lwRate ? item.lwRate.threeLevelBean ? item.lwRate.threeLevelBean.level_num : '--' : '--',
            lwRate_IV: item.lwRate ? item.lwRate.fourLevelBean ? item.lwRate.fourLevelBean.level_num : '--' : '--',

          }
        }
        let data = datas.map((v) => filterVal.map((j) => v[j])); // item.tableData为请求的数据，此处理是为了对应字段
        let merges = [
          'C1:F1', 'G1:J1', 'K1:N1', 'O1:R1', 'S1:V1'
        ];// 如果是A1到I1合并就写A1:I1, 纵向合并 为 A1:A3, 只需要设置需要合并的单元格即可
        let excelname = '数据应用情况'
        excel.export_json_to_excel({
          multiHeader, // 这里是第一行的表头
          multiHeader2, // 这里是第二行的表头
          header: tHeader, // 这里是第三行的表头
          data,
          filename: excelname,
          merges,
          autoWidth: false
        })
      })
    },
    //获取时间
    handleChange(time) {
      this.day.dateTime = time

    },
    //切换数据
    datePickClick() {
      this.showDatePick = !this.showDatePick
      if (this.showDatePick) {
        this.day.dateTime = []
      } else {
        this.day.dayValue = ""
      }
      this.page.subscribeState = ''
    }
  },
  mounted() {

    this.sa_SpringEnterDeptPageView_queryDetectEnt().then(res => {
      this.page.subscribelist = res.data.enterDeptInfos
    })
    if (this.$route.query.batchid) {
      this.day.dayValue = parseInt(this.$route.query.cyc)
      this.page.subscribeState = parseInt(this.$route.query.subid)
      this.sa_SpringDetectJobPageView_jobBoxQuery({
        detect_ent_no: this.page.subscribeState.toString(),
        cycle: this.day.dayValue
      }).then(res => {
        this.batch.batchList = res.data.detectJobBeans
        this.batch.batchValue = parseInt(this.$route.query.batchid)
        this.searchDefect()
      })
    }
  },
};

</script>
<style lang="less" scoped>
.conBox {
  height: 100%;

  .anouter {
    width: 100%;
    height: calc(100% - 100px);
    display: flex;

    .analysis-left {
      width: 339px;
      height: 100%;
      margin-right: 9px;

      .analysis-l-bom {
        border-radius: 4px;
        height: 100%;
        overflow: auto;
        border-radius: 2px;
        border: 1px solid transparent;

        li {
          padding: 14px;
          border-bottom: 1px solid transparent;
          position: relative;

          .analysis-title {
            display: flex;

            span {
              margin-left: auto;
            }
          }

          label {
            font-size: 14px;
            // font-weight: 600;
            // color: rgba(64, 85, 128, 1);
          }

          .list-top {
            height: 30px;
            line-height: 30px;
            display: flex;
            justify-content: space-between;

            label {
              color: rgba(64, 86, 128, 0.6);
            }
          }

          .alb-outer {
            display: flex;

            .line {
              width: 1px;
              height: 31px;
              background: #e1e6f0;
              position: absolute;
              top: 50%;
              left: 50%;
              margin-top: -10px;
            }

            .alb-inner {
              width: 50%;
              text-align: center;

              p {
                margin: 10px 0;
                // color: rgba(207, 215, 229, 1);
              }

              .alb-o-num {
                font-size: 40px;

                span {
                  font-size: 14px;
                }
              }
            }
          }
        }

        .box-li01 {
          height: 38%;
          width: 100%;
          min-height: 302px;
        }

        .box-draw {
          height: calc(100% - 20px);
        }

        .box-li02 {
          height: 38%;
          width: 100%;
          min-height: 302px;
        }
      }
    }

    .analysis-right {
      width: calc(100% - 348px);

      .analysis-r-bom {
        height: 100%;
        border-radius: 4px;
        border: 1px solid transparent;
        position: relative;
      }
    }
  }

  /deep/.boxColor {
    width: 64px;
    height: 30px;
    line-height: 30px;
    color: #fff;

    border-radius: 4px 4px 4px 4px;
  }

  .theme-blue-01 {
    color: #a3b1cc !important;
  }

  .searchBtn {
    width: 80px;
    min-width: 80px;
    height: 40px;
    font-family: PingFang SC;
  }
}

/deep/ .ivu-table-cell {
  font-weight: 500 !important;
}

.theme-white-table {
  /deep/.ivu-table-header {
    border-bottom: 1px solid #e1e6f0;

    th[colspan="4"] {
      border-bottom: 1px solid #e1e6f0;
    }
  }

  /deep/.ivu-table-border td,
  /deep/ .ivu-table-border th {
    border-right: 1px solid #e1e6f0;
  }
}

.pictureheader {
  width: 100%;
  border: 1px solid #cfd7e5;
  display: flex;
  align-items: center;
  border-radius: 4px;
  margin-bottom: 8px;
  height: 72px;
  padding: 0 16px;
  overflow: hidden;

  .open-btn {
    margin-left: auto;
  }

  .analysis-add {
    width: 40px;
    height: 40px;

    line-height: 40px;
    text-align: center;
    border-radius: 4px;
    cursor: pointer;
    border: 1px solid #ccc;
    margin: 0 10px;

    &:hover {
      opacity: 0.8;
    }

    i {
      font-size: 18px;
    }
  }
}

.anouter2 {
  height: calc(100% - 100px);
  background: #fff;
  border-radius: 4px;
  border: 1px solid #ccc;
  position: relative;

  .default-box {
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -125px 0 0 -130px;

    p {
      margin-top: 10px;
      height: 30px;
      line-height: 30px;
      text-align: center;
      font-size: 14px;
      color: #333333;
    }

    .default-img {
      width: 250px;
      height: 260px;
    }
  }
}

.theme-blue.anouter2 {
  background: #2f3e59;

  p {
    color: #fff;
  }
}

.car_title {
  font-weight: 500;
}
.pickerborder {
  width: 322px;
  border-radius: 4px;

  /deep/ .ivu-input {
    border: 1px solid #e1e6f0 !important;

  }
}
.theme-blue.pickerborder {
  /deep/ .ivu-input {
    border: 1px solid #566582 !important;

  }
}
</style>
